import React, { PureComponent } from 'react';
import { connect } from 'dva';
import { DownOutlined, PlusOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
import { Form } from '@ant-design/compatible';
import '@ant-design/compatible/assets/index.css';
import {
  Card,
  Button,
  Modal,
  Input,
  Row,
  Col,
  message,
  Divider,
  Dropdown,
  Menu,
  Badge,
  Select,
  Spin,
} from 'antd';
import router from 'umi/router';
import moment from 'moment';
import StandardTable from '@/components/StandardTable';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import { checkPermissions } from '@/utils/authority';
import Authorized from '@/utils/Authorized';
import styles from '@/utils/utils.less';
import HOCSelect from '@/components/AntDesign/Select';
import TextOverFlow from '../../components/TextOverFlow';
// import Supplier from '../../components/NsSupplier';

const FormItem = Form.Item;
const { Option } = Select;
const { confirm } = Modal;
@connect(({ login, supplieraccountmanage, loading }) => ({
  baseUser: login.baseUser,
  pageData: supplieraccountmanage.pageData,
  loading: loading.effects['supplieraccountmanage/getPageList'],
  formFieldsValue: supplieraccountmanage.formFieldsValue,
  supplieraccountmanage,
  valuesArr: supplieraccountmanage.valuesArr,
}))
@Form.create()
// @Form.useForm()
class BasicList extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      selectedRows: [],
      selectedRowKeys: [],
      isdsibled: false,
      visible1: false,
      visible2: false,
    };
  }

  componentDidMount() {
    const {
      dispatch,
      baseUser: { userType },
    } = this.props;
    dispatch({
      type: 'supplieraccountmanage/getMgrSuppList',
      payload: {},
    });
    dispatch({
      type: 'publicdata/fetchDictCode',
      payload: ['SYS_PORT'],
    }).then(data => {
      let addPort = [];
      if (userType === 2) {
        addPort = data.SYS_PORT.filter(item => item.itemCode !== '1');
      } else {
        addPort = data.SYS_PORT;
      }
      dispatch({
        type: 'supplieraccountmanage/updateModelData',
        payload: {
          addPort,
        },
      });
    });
    this.getInitialList();
  }

  getInitialList = () => {
    const {
      pageData: { pagination },
      dispatch,
      location,
      formFieldsValue,
    } = this.props;
    if (location.queryParam) {
      dispatch({
        type: 'supplieraccountmanage/updateModelData',
        payload: { formFieldsValue: location.queryParam },
      });
    }
    this.searchList(
      this.processFormData({ ...formFieldsValue }),
      pagination.current,
      pagination.pageSize
    );
  };

  // 点击查询按钮
  searchBtnList = () => {
    const { form, valuesArr, dispatch } = this.props;
    form.validateFieldsAndScroll([...valuesArr], (err, values) => {
      if (!err) {
        dispatch({
          type: 'supplieraccountmanage/updateModelData',
          payload: {
            formFieldsValue: values,
          },
        });
        this.searchList(this.processFormData(values));
      }
    });
  };

  // 查询
  searchList = (formFieldsValue, currentPage = 1, pageSize = 10, isClear = true) => {
    if (isClear) {
      this.setState({ selectedRows: [], selectedRowKeys: [] });
    }
    const { dispatch } = this.props;
    const pageArg = { currentPage, pageSize };
    const values = {
      ...formFieldsValue,
      pageArg,
    };

    dispatch({
      type: 'supplieraccountmanage/updateModelData',
      payload: {
        values,
      },
    });

    dispatch({
      type: 'supplieraccountmanage/getPageList',
      payload: values,
    });
  };

  // 处理form数据
  processFormData = fieldsValue => {
    const formFieldsValue = {};
    const tempFieldsValue = fieldsValue;
    Object.keys(tempFieldsValue).forEach(key => {
      if (key === 'suppCode') {
        tempFieldsValue[key] = (tempFieldsValue[key] && tempFieldsValue[key].trim()) || null;
      }
      if (tempFieldsValue[key] && tempFieldsValue[key].key) {
        formFieldsValue[key] =
          tempFieldsValue[key].key === undefined ? null : tempFieldsValue[key].key;
      } else {
        formFieldsValue[key] = tempFieldsValue[key] === undefined ? null : tempFieldsValue[key];
      }
    });
    if (formFieldsValue.suppCode === '') {
      formFieldsValue.suppCode = null;
    }
    formFieldsValue.suppId = formFieldsValue.name;
    delete formFieldsValue.name;
    return formFieldsValue;
  };

  // 点击复选框
  handleSelectRows = (selectedRows, selectedRowKeys) => {
    this.setState({ selectedRows, selectedRowKeys });
  };

  // 表格有变化：比如：切换页码
  handleStandardTableChange = pagination => {
    const { formFieldsValue } = this.props;
    this.searchList(
      this.processFormData(formFieldsValue),
      pagination.current,
      pagination.pageSize,
      false
    );
  };

  // 重置查询
  resetSearch = () => {
    const { form, dispatch } = this.props;
    dispatch({
      type: 'supplieraccountmanage/updateModelData',
      payload: { formFieldsValue: {} },
    });
    form.resetFields();
  };

  // 新增
  addLislette = e => {
    const {
      form,
      baseUser: { userType },
    } = this.props;
    this.resetSearch(e);
    this.setState(
      {
        visible1: true,
      },
      () => {
        if (userType === 2) {
          form.setFieldsValue({ sysPort: '2' });
        }
      }
    );
  };

  // 供应商 新增弹框 隐藏
  click1C = () => {
    this.setState({ visible1: false });
  };

  onOk = () => {
    const {
      form,
      supplieraccountmanage: { corpId, suppCodeLs, name },
      dispatch,
      pageData,
      formFieldsValue,
    } = this.props;
    form.validateFieldsAndScroll(
      ['suppId', 'sysPort', 'loginName', 'passwordOne', 'userPwd', 'manager', 'phone', 'email'],
      (err, values) => {
        if (!err) {
          if (values.passwordOne !== values.userPwd) {
            message.warning('两次密码不一致');
            return;
          }
          const param = {
            suppAdminFlag:2,
            suppId: values.suppId,
            corpId, // 公司id
            suppCode: suppCodeLs, // 供应商编号
            suppName: name, // 供应商名称
            sysPort: values.sysPort, // 系统
            loginName: values.loginName, // 登陆账号
            userPwd: values.userPwd, // 用户密码/
            manager: values.manager, // 负责人
            phone: values.phone, // 手机
            email: values.email, // 邮箱
            remark: values.remark, // 备注/
          };
          dispatch({
            type: 'supplieraccountmanage/insertAccount',
            payload: param,
          }).then(res => {
            if (res.success) {
              message.success('新增成功');
              this.setState({
                visible1: false,
              });
              this.searchList(
                this.processFormData(formFieldsValue),
                pageData.pagination.current,
                pageData.pagination.pageSize
              );
            } else {
              message.warning(res.message || '服务端错误');
            }
          });
        }
      }
    );
  };

  // 提交
  onOktwo = () => {
    const {
      pageData,
      dispatch,
      form,
      supplieraccountmanage: {
        corpId,
        suppCodeLs,
        name,
        suppUserId,
        userId,
        detailFormValue,
        supplyName,
      },
      formFieldsValue,
    } = this.props;
    form.validateFieldsAndScroll(
      [
        'suppUserIdEdit',
        'sysPortEdit',
        'loginNameEdit',
        'userPwdEdit',
        'managerEdit',
        'phoneEdit',
        'emailEdit',
        'remarkEdit',
        'passwordOneEdit',
      ],
      (err, values) => {
        if (!err) {
          if (values.passwordOneEdit !== values.userPwdEdit) {
            message.warning('两次密码不一致');
            return;
          }
          const param = {
            suppAdminFlag:2,
            suppId: supplyName ? detailFormValue.suppId : values.suppUserIdEdit,
            corpId, // 公司id
            suppCode: suppCodeLs, // 供应商编号
            suppName: name, // 供应商名称
            sysPort: values.sysPortEdit, // 系统
            loginName: values.loginNameEdit, // 登陆账号
            userPwd: values.userPwdEdit, // 用户密码//////////////////////////////
            manager: values.managerEdit, // 负责人
            phone: values.phoneEdit, // 手机
            email: values.emailEdit, // 邮箱
            remark: values.remarkEdit, // 备注//////////////////////
            suppUserId,
            userId,
          };
          dispatch({
            type: 'supplieraccountmanage/updateAccount',
            payload: param,
          }).then(res => {
            if (res.success) {
              message.success('修改成功');
              this.setState({
                visible2: false,
              });
              this.searchList(
                this.processFormData(formFieldsValue),
                pageData.pagination.current,
                pageData.pagination.pageSize
              );
            } else {
              message.warning(res.message || '服务端错误');
            }
          });
        }
      }
    );
  };

  qweqwe = e => {
    const {
      dispatch,
      supplieraccountmanage: { supplyNameList },
    } = this.props;
    supplyNameList.forEach(item => {
      if (item.suppId === e.key) {
        dispatch({
          type: 'supplieraccountmanage/updateModelData',
          payload: {
            corpId: item.corpId,
            suppCodeLs: item.suppCode,
            name: item.name,
          },
        });
      }
    });
  };

  // 修改启用停用状态
  updateStatus = (suppUserId, suppUserStatus) => {
    const { dispatch, pageData, formFieldsValue } = this.props;
    confirm({
      title: `你确定要${suppUserStatus === 2 ? '停用' : '启用'}此角色状态吗？`,
      icon: <ExclamationCircleOutlined />,
      okText: '确定',
      okType: 'primary',
      cancelText: '取消',
      onOk: () => {
        const newUserStatus = suppUserStatus === 2 ? 3 : 2;
        dispatch({
          type: 'supplieraccountmanage/updateAccountStatus',
          payload: { suppUserId },
        }).then(res => {
          if (res.success) {
            message.success(`${newUserStatus === 2 ? '启用成功！' : '停用成功！'}`);
            this.searchList(
              this.processFormData(formFieldsValue),
              pageData.pagination.current,
              pageData.pagination.pageSize
            );
          } else {
            message.warning(`${newUserStatus === 2 ? '启用失败！' : '停用失败！'}`);
          }
        });
      },
      onCancel: () => {
        this.setState({ selectedRowKeys: [] });
      },
    });
  };

  // 删除数据
  delList = suppUserId => {
    const { dispatch, pageData, formFieldsValue } = this.props;
    confirm({
      title: '你确定要删除此条供应商信息吗？',
      okText: '确定',
      okType: 'primary',
      cancelText: '取消',
      style: { top: 200 },
      onOk: () => {
        dispatch({
          type: 'supplieraccountmanage/deleteAccount',
          payload: { suppUserId },
        }).then(res => {
          if (res.success) {
            this.searchList(
              this.processFormData(formFieldsValue),
              pageData.pagination.current,
              pageData.pagination.pageSize
            );
          }
        });
      },
      onCancel: () => {
        this.setState({ selectedRowKeys: [] });
      },
    });
  };

  // 供应商 新增弹框 隐藏
  click2C = () => {
    this.setState({ visible2: false });
  };

  chinbin = () => {
    this.setState({ visible2: true });
  };

  mangerlist = () => {
    const { visible1, visible2 } = this.state;
    const { form } = this.props;
    if (visible1) {
      form.validateFields(['passwordOne', 'userPwd'], (err, values) => {
        if (err) return;
        if (values.passwordOne !== values.userPwd) {
          message.warning('两次密码不一致');
        }
      });
    }
    if (visible2) {
      form.validateFields(['passwordOneEdit', 'userPwdEdit'], (err, values) => {
        if (err) return;
        if (values.passwordOneEdit !== values.userPwdEdit) {
          message.warning('两次密码不一致');
        }
      });
    }
  };

  // 点击修改时
  modify = (suppUserId, suppUserStatus) => {
    const { dispatch } = this.props;
    if (suppUserStatus === 2 || suppUserStatus === 3) {
      this.setState({
        isdsibled: true,
      });
    } else {
      this.setState({
        isdsibled: false,
      });
    }
    this.setState({ visible2: true, selectedRowKeys: [suppUserId] });
    dispatch({
      type: 'supplieraccountmanage/queryAccountById',
      payload: { suppUserId },
    });
  };

  render() {
    const { selectedRows, selectedRowKeys, visible1, visible2, isdsibled } = this.state;
    const {
      form: { getFieldDecorator },
      formFieldsValue,
      pageData,
      loading,
      supplieraccountmanage: { supplyNameList, addPort, detailFormValue, supplyName },
    } = this.props;
    const formItemLayout = {
      labelCol: { md: { span: 7 } },
      wrapperCol: { md: { span: 17 } },
    };
    const columns = [
      {
        title: '供应商编号',
        dataIndex: 'suppCode',
        onHeaderCell: () => ({ style: { fontWeight: 'bolder' } }),
      },
      {
        title: '供应商名称',
        dataIndex: 'suppName',
        onHeaderCell: () => ({ style: { fontWeight: 'bolder' } }),
        render: text => <TextOverFlow text={text} />,
      },
      {
        title: '使用系统端口',
        dataIndex: 'sysPortName',
        onHeaderCell: () => ({ style: { fontWeight: 'bolder' } }),
      },
      {
        title: '账号状态',
        dataIndex: 'suppUserStatus',
        onHeaderCell: () => ({ style: { fontWeight: 'bolder' } }),
        render: (text, record) => {
          let status = '';
          switch (text) {
            case 1:
              status = 'default';
              break;
            case 2:
              status = 'success';
              break;
            default:
              status = 'error';
          }
          return <Badge key={text} status={status} text={record.suppUserStatusName} />;
        },
      },
      {
        title: '创建时间',
        dataIndex: 'creTime',
        align: 'center',
        sorter: (a, b) => new Date(b.createTime) - new Date(a.createTime),
        onHeaderCell: () => ({ style: { fontWeight: 'bold' } }),
        render: val => (val ? moment(val).format('YYYY-MM-DD HH:mm') : '暂无'),
      },
      {
        title: '操作',
        dataIndex: 'operation',
        onHeaderCell: () => ({ style: { fontWeight: 'bold', width: 150, textAlign: 'center' } }),
        onCell: () => ({ style: { textAlign: 'center' } }),
        render: (text, record) => (
          // eslint-disable-next-line react/jsx-indent
          <span>
            <Authorized authority="mgr:suAccount:updateAccount" noMatch={null}>
              <a onClick={() => this.modify(record.suppUserId, record.suppUserStatus)}>修改</a>
              <Divider type="vertical" />
            </Authorized>
            <Dropdown
              overlay={
                <Menu>
                  {checkPermissions('mgr:suAccount:updateAccountStatus') && (
                    <Menu.Item
                      key="able"
                      onClick={() => this.updateStatus(record.suppUserId, record.suppUserStatus)}
                    >
                      {record.suppUserStatus === 2 ? '停用' : '启用'}
                    </Menu.Item>
                  )}
                  {record.suppUserStatus === 1
                    ? checkPermissions('mgr:suAccount:deleteAccount') && (
                        // eslint-disable-next-line react/jsx-indent
                        <Menu.Item key="del" onClick={() => this.delList(record.suppUserId)}>
                          删除
                        </Menu.Item>
                      )
                    : null}
                  <Menu.Item
                    key="view"
                    onClick={() =>
                      router.push(`/supplymanage/account/detail?suppUserId=${record.suppUserId}`)
                    }
                  >
                    查看
                  </Menu.Item>
                </Menu>
              }
            >
              <a>
                更多 <DownOutlined />
              </a>
            </Dropdown>
          </span>
        ),
      },
    ];
    const renderSimpleForm = (
      <Form layout="inline">
        <Row gutter={{ md: 8, lg: 24, xl: 48 }}>
          <Col md={8} sm={24}>
            <FormItem {...formItemLayout} label="供应商编号">
              {getFieldDecorator('suppCode', {
                initialValue: formFieldsValue.suppCode,
              })(<Input placeholder="请输入" />)}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            {/* <FormItem {...formItemLayout} label="选择供应商">
              {getFieldDecorator('name', {
                initialValue: formFieldsValue.name,
              })(<Supplier allowClear />)}
            </FormItem> */}
            <FormItem {...formItemLayout} label="选择供应商">
              {getFieldDecorator('name', {
                initialValue: formFieldsValue.name,
              })(
                <HOCSelect
                  placeholder="请输入"
                  labelInValue
                  showSearch
                  optionFilterProp="children"
                  allowClear
                >
                  {supplyNameList.map(options => (
                    <Option key={options.suppId} title={options.name}>
                      {options.name}
                    </Option>
                  ))}
                </HOCSelect>
              )}
            </FormItem>
          </Col>
          <Col md={8} sm={24}>
            <span className={styles.submitButtons}>
              <Button type="primary" htmlType="submit" onClick={this.searchBtnList}>
                查询
              </Button>
              <Button style={{ marginLeft: 8 }} onClick={this.resetSearch}>
                重置
              </Button>
            </span>
          </Col>
        </Row>
      </Form>
    );
    // 供应商 新增 弹框配置
    const modalConfig = {
      title: '新增供应商账号',
      visible: visible1,
      onOk: this.onOk,
      okText: '提交',
      onCancel: this.click1C,
    };
    const modalConfig1 = {
      title: '修改供应商账号',
      visible: visible2,
      onOk: this.onOktwo,
      okText: '提交',
      onCancel: this.click2C,
    };
    // 供应商 新增 表单 表单域配置
    const formItemLayoutAdd = {
      labelCol: { md: { span: 5 } },
      wrapperCol: { md: { span: 16, offset: 1 } },
    };
    // const name = supplyNameList.map(options => (
    //   <Option key={options.suppId}>{options.name}</Option>
    // ));
    return (
      <PageHeaderWrapper>
        <Card className={styles.searchCard}>
          <div className={styles.tableListForm}>{renderSimpleForm}</div>
        </Card>
        <Card className={styles.tableCard}>
          <div style={{ marginBottom: 16 }}>
            <Authorized authority="mgr:suAccount:insertAccount" noMatch={null}>
              <Button type="primary" onClick={this.addLislette}>
                <PlusOutlined />
                新增
              </Button>
            </Authorized>
          </div>
          <Row>
            <div style={{ width: '100%' }}>
              <StandardTable
                selectedRows={selectedRows}
                selectedRowKeys={selectedRowKeys}
                loading={loading}
                data={pageData}
                rowKey="suppId"
                columns={columns}
                onSelectRow={this.handleSelectRows}
                onChange={this.handleStandardTableChange}
              />
            </div>
          </Row>
        </Card>
        {/* 新增弹框   */}
        <Modal {...modalConfig} destroyOnClose>
          <Form onSubmit={this.onSubmit}>
            {/* <FormItem {...formItemLayoutAdd} label="选择供应商">
              {getFieldDecorator('suppId', {rules: [
                  {
                    required: true,
                    message: '请选择',
                  },
                ],
              })(<Supplier allowClear />)}
            </FormItem> */}
            <FormItem {...formItemLayoutAdd} label="选择供应商">
              {getFieldDecorator('suppId', {
                rules: [
                  {
                    required: true,
                    message: '请选择',
                  },
                ],
              })(
                <HOCSelect
                  placeholder="请输入关键字检索"
                  showSearch
                  optionFilterProp="children"
                  dropdownMatchSelectWidth={false}
                >
                  {supplyNameList.map(options => (
                    <Option key={options.suppId} onClick={this.qweqwe} value={options.suppId}>
                      {options.name}
                    </Option>
                  ))}
                </HOCSelect>
              )}
            </FormItem>
            <FormItem {...formItemLayoutAdd} label="选择系统端口">
              {getFieldDecorator('sysPort', {
                rules: [
                  {
                    required: true,
                    message: '请选择',
                  },
                ],
              })(
                <HOCSelect placeholder="请选择">
                  {addPort.map(item => (
                    <Option key={item.itemCode} value={item.itemCode}>
                      {item.itemName}
                    </Option>
                  ))}
                </HOCSelect>
              )}
            </FormItem>
            <FormItem label="登录账号" {...formItemLayoutAdd}>
              {getFieldDecorator('loginName', {
                rules: [{ required: true, message: '请输入' }],
              })(<Input placeholder="请输入" />)}
            </FormItem>
            <FormItem {...formItemLayoutAdd} label="设置密码">
              {getFieldDecorator('passwordOne', {
                rules: [
                  { required: true, message: '6~16位英文字母、数字、字符组合。', min: 6, max: 16 },
                ],
              })(
                <Input
                  onFocus={e => {
                    e.target.type = 'password';
                  }}
                  placeholder="请输入"
                />
              )}
            </FormItem>

            <FormItem {...formItemLayoutAdd} label="再次确认密码">
              {getFieldDecorator('userPwd', {
                rules: [
                  { required: true, message: '6~16位英文字母、数字、字符组合。', min: 6, max: 16 },
                ],
              })(
                <Input
                  onBlur={this.mangerlist}
                  onFocus={e => {
                    e.target.type = 'password';
                  }}
                  placeholder="请输入"
                />
              )}
            </FormItem>

            <FormItem {...formItemLayoutAdd} label="负责人">
              {getFieldDecorator('manager', {
                rules: [{ required: true, message: '请输入' }],
              })(<Input onChange={this.mangerlist} maxLength={20} placeholder="请输入" />)}
            </FormItem>
            <FormItem {...formItemLayoutAdd} label="联系电话">
              {getFieldDecorator('phone', {
                rules: [{ required: true, message: '请输入' }],
              })(<Input style={{ width: '315px' }} maxLength={12} placeholder="请输入" />)}
            </FormItem>
            <FormItem {...formItemLayoutAdd} label="邮箱">
              {getFieldDecorator('email', {
                rules: [
                  {
                    type: 'email',
                    message: '请输入正确的邮箱地址!',
                  },
                  {
                    required: true,
                    message: '请输入',
                  },
                ],
              })(<Input maxLength={50} placeholder="请输入" />)}
            </FormItem>
            <FormItem {...formItemLayoutAdd} label="备注">
              {getFieldDecorator('remark', {
                rules: [{ required: false, message: '请输入' }],
              })(<Input maxLength={200} placeholder="请输入" />)}
            </FormItem>
          </Form>
        </Modal>
        <Modal {...modalConfig1} destroyOnClose>
          <Spin spinning={loading}>
            <Form onSubmit={this.onSubmit}>
              <FormItem {...formItemLayoutAdd} label="选择供应商">
                {getFieldDecorator('suppUserIdEdit', {
                  rules: [
                    {
                      required: true,
                      message: '请选择',
                    },
                  ],
                  initialValue:
                    supplyName || (detailFormValue.suppId && detailFormValue.suppId.toString()),
                })(
                  <HOCSelect
                    placeholder="请输入关键字检索"
                    showSearch
                    disabled={isdsibled}
                    optionFilterProp="children"
                    dropdownMatchSelectWidth={false}
                  >
                    {supplyNameList.map(options => (
                      <Option key={options.suppId} onClick={this.qweqwe} value={options.suppId}>
                        {options.name}
                      </Option>
                    ))}
                  </HOCSelect>
                )}
              </FormItem>
              <FormItem {...formItemLayoutAdd} label="选择系统端口">
                {getFieldDecorator('sysPortEdit', {
                  rules: [
                    {
                      required: true,
                      message: '请选择',
                    },
                  ],
                  initialValue: detailFormValue.sysPort && detailFormValue.sysPort.toString(),
                })(
                  <HOCSelect disabled={isdsibled} placeholder="请选择">
                    {addPort.map(item => (
                      <Option key={item.itemCode} value={item.itemCode}>
                        {item.itemName}
                      </Option>
                    ))}
                  </HOCSelect>
                )}
              </FormItem>
              <FormItem label="登录账号" {...formItemLayoutAdd}>
                {getFieldDecorator('loginNameEdit', {
                  rules: [{ required: true, message: '请输入' }],
                  initialValue: detailFormValue.loginName,
                })(<Input placeholder="请输入" disabled={isdsibled} />)}
              </FormItem>
              <FormItem {...formItemLayoutAdd} label="设置密码">
                {getFieldDecorator('passwordOneEdit', {
                  rules: [
                    {
                      required: true,
                      message: '6~16位英文字母、数字、字符组合。',
                      min: 6,
                      max: 16,
                    },
                  ],
                  initialValue: '******',
                })(<Input type="password" autoComplete="new-password" placeholder="请输入" />)}
              </FormItem>

              <FormItem {...formItemLayoutAdd} label="再次确认密码">
                {getFieldDecorator('userPwdEdit', {
                  rules: [
                    {
                      required: true,
                      message: '6~16位英文字母、数字、字符组合。',
                      min: 6,
                      max: 16,
                    },
                  ],
                  initialValue: '******',
                })(
                  <Input
                    type="password"
                    onBlur={this.mangerlist}
                    autoComplete="new-password"
                    placeholder="请输入"
                  />
                )}
              </FormItem>

              <FormItem {...formItemLayoutAdd} label="负责人">
                {getFieldDecorator('managerEdit', {
                  rules: [{ required: true, message: '请输入' }],
                  initialValue: detailFormValue.manager,
                })(<Input onChange={this.mangerlist} placeholder="请输入" />)}
              </FormItem>
              <FormItem {...formItemLayoutAdd} label="联系电话">
                {getFieldDecorator('phoneEdit', {
                  rules: [{ required: true, message: '请输入' }],
                  initialValue: detailFormValue.phone,
                })(<Input style={{ width: '315px' }} maxLength={12} placeholder="请输入" />)}
              </FormItem>
              <FormItem {...formItemLayoutAdd} label="邮箱">
                {getFieldDecorator('emailEdit', {
                  rules: [
                    {
                      type: 'email',
                      message: '请输入正确的邮箱地址!',
                    },
                    {
                      required: true,
                      message: '请输入',
                    },
                  ],
                  initialValue: detailFormValue.email,
                })(<Input maxLength={50} placeholder="请输入" />)}
              </FormItem>
              <FormItem {...formItemLayoutAdd} label="备注">
                {getFieldDecorator('remarkEdit', {
                  rules: [{ required: false, message: '请输入' }],
                  initialValue: detailFormValue.remark,
                })(<Input maxLength={200} placeholder="请输入" />)}
              </FormItem>
            </Form>
          </Spin>
        </Modal>
      </PageHeaderWrapper>
    );
  }
}
const ListSearchForm = Form.create()(BasicList);
export default ListSearchForm;
